<template>
  <div>
    <v-app-bar app color="indigo darken-2">
      <v-avatar size="50" color="grey">
        <img src="~assets/head.jpg">
      </v-avatar>

      <v-container class="py-0 fill-height">
        <v-btn text color="white">首页</v-btn>
        <v-btn v-for="(item,index) in cateList" :key="index+item" text color="white">{{item.name}}</v-btn>
      </v-container>

      <v-spacer></v-spacer>

      <v-responsive max-width="260" color="white">
        <v-text-field dense flat hide-details solo-inverted rounded dark></v-text-field>
      </v-responsive>
    </v-app-bar>
  </div>
</template>

<script>
export default {
  data () {
    return {
      cateList: [],
    }
  },
  created () {
    this.getCateList()
  },
  methods: {
    // 获取分类
    async getCateList () {
      const { data: res } = await this.$http.get('categorys')
      this.cateList = res.data
    },
  },
}
</script>

<style>

</style>
